<template>
<el-form :model="thingForm" :rules="rules" ref="thingForm" label-width="100px" class="demo-thingForm">
  <el-form-item label="事件标题" prop="thTitle">
    <el-input placeholder="请输入事件标题" v-model="thingForm.thTitle"></el-input>
  </el-form-item>
  <el-form-item label="创建人" prop="thCreator">
    <el-input placeholder="请输入创建人" v-model="thingForm.thCreator"></el-input>
  </el-form-item>
  <el-form-item label="创建时间"  prop="thCreateDate">  
          <el-date-picker type="datetime" placeholder="选择日期时间" v-model="thingForm.thCreateDate" style="width: 100%;"></el-date-picker>
  </el-form-item>
  <el-form-item label="工作量" prop="thWorkNum">
    <el-input placeholder="请填写工作量" v-model="thingForm.thWorkNum">
    <template slot="append">小时</template>
    </el-input>
  </el-form-item>
  <el-form-item label="事件内容" prop="thContent">
    <el-input  placeholder="请填写事件内容" type="textarea" v-model="thingForm.thContent"></el-input>
  </el-form-item>
  <el-form-item>
    <el-button type="primary" @click="submitForm('thingForm')">保存</el-button>
  </el-form-item>
</el-form>
</template>
<script>
//  import axios from 'axios'
 export default {
   data () {
     return {
       rules: {
         thTitle: [
            { required: true, message: '请输入事件标题', trigger: 'blur' }
         ],
         thCreator: [
            { required: true, message: '请输入创建人', trigger: 'blur' }
         ],
         thCreateDate: [
            { type: 'date', required: true, message: '请填写创建日期', trigger: 'blur' }
         ],
        //  thWorkNum: [
        //     { required: true, message: '请填写工作量', trigger: 'blur' }
        //  ],
         thContent: [
            { required: true, message: '请填写事件内容', trigger: 'blur' }
         ]
       }
     }
   },
   methods: {
     submitForm (formName) {
       this.$refs[formName].validate((valid) => {
         if (valid) {
          //  axios.post('/api/save', this.formName).then(function (res) {
          //    if (res.status === 200) {
          //      this.$message('项目保存成功')
           this.$emit('saveThing', this.thingForm)
          //    }
          //  })
         } else {
           this.$message('请按要求填写事件信息')
           return false
         }
       })
     },
     resetForm (formName) {
       this.$refs[formName].resetFields()
     }
   },
   props: [
     'thingForm'
   ]
 }
</script>
<style>
 .demo-thingForm {
     padding:50px 100px
 }
</style>